<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        body {
            background: #111;
            overflow: hidden;
        }
    </style>
</head>
<body>
<canvas id="cubes"></canvas>
</body>
</html>
<script>
    var canv = document.getElementById('cubes');
    canv.width = window.innerWidth;
    canv.height = window.innerHeight;
    var cont = canv.getContext('2d');
    cont.fillStyle = '#eee';
    cont.fillRect(0, 0, canv.width, canv.height);

    var cols = [{
        t: '#6c96eb',
        l: '#3f76e5',
        r: '#1d59d4'
    }, {
        t: '#71c5a6',
        l: '#4db68f',
        r: '#3c9473'
    }, {
        t: '#cb71db',
        l: '#bc48d1',
        r: '#a32fb7'
    }, {
        t: '#a2c571',
        l: '#8ab64d',
        r: '#6f943c'
    }, {
        t: '#d4a636',
        l: '#b18926',
        r: '#87681d'
    }, {
        t: '#d47936',
        l: '#b16126',
        r: '#874a1d'
    }, {
        t: '#e02f2f',
        l: '#bf1d1d',
        r: '#931616'
    }];

    function poly(col, points) {
        cont.fillStyle = col;
        cont.beginPath();
        cont.moveTo(points[0][0], points[0][1]);
        for (var c = 1; c < points.length; c++) {
            cont.lineTo(points[c][0], points[c][1]);
        }
        cont.closePath();
        cont.fill();
    }



    fc = 0;
    setInterval(function() {
        if (50 < fc) {
            cont.fillStyle = 'rgba(255,255,255,0.1)';
            cont.fillRect(0, 0, canv.width, canv.height);
            if (fc == 60) {
                fc = 0;
            }
        }
        fc++;
        var c = Math.floor((Math.random() * 7)),
                s = Math.floor((Math.random() * 5) + 1),
                ox = Math.floor((Math.random() * ((canv.width / s)))) * s - 100,
                oy = Math.floor((Math.random() * ((canv.height / s)))) * s - 100,
                n8 = s * 8,
                n16 = s * 16,
                n20 = s * 20,
                n32 = s * 32,
                n40 = s * 40,
                x20 = n20 + ox,
                x40 = n40 + ox,
                y8 = n8 + oy,
                y16 = n16 + oy,
                y32 = n32 + oy,
                y40 = n40 + oy;
        poly(cols[c]['t'], [
            [ox, y8],
            [x20, oy],
            [x40, y8],
            [x20, y16]
        ]);
        poly(cols[c]['l'], [
            [ox, y8],
            [x20, y16],
            [x20, y40],
            [ox, y32]
        ]);
        poly(cols[c]['r'], [
            [x20, y16],
            [x40, y8],
            [x40, y32],
            [x20, y40]
        ]);
    }, 1000 / 40)
</script>